/* children属性
可以是任意数据类型,需要掌握的是函数
 */
import React, { Component } from 'react';

export default class App extends Component {
  render() {
    return (
      <div>
        <Child>
          {/* data只是一个形参，用于接收子组件传过来的数据 */}
          {(data) => {
            console.log('data  ----->  ', data);
            // 父组件可以自定义渲染的内容
            return (
              <ul>
                {data.map((item, index) => (
                  <li key={index}>{item}</li>
                ))}
              </ul>
            );
          }}
        </Child>
      </div>
    );
  }
}
class Child extends React.Component {
  state = {
    list: ['春天', '夏天', '秋天'],
  };
  render() {
    const { children } = this.props;
    return (
      <div>
        <h2>我是子</h2>
        {/* 1、子组件向父组件传值 */}
        <h1>{children(this.state.list)}</h1>
      </div>
    );
  }
}
